<template>
  <div>
    <!-- v-model的修饰符 .number 变成数字类型  .trim 去除前后的空白格 .lazy 失焦了才会触发 -->
     <form>
        <input type="text" name="123" v-model.lazy="form.username">
        <br>
        <input type="text" name="123" v-model.number="form.password">
        <button @click.prevent.stop="fn">提交</button>
    </form>
   </div>
</template>
 
<script>
export default {

  data() {
    return {
      form:{
        username:'',
        password:''
      }
    };
  },

  methods: {
    fn(){
      console.log(this.form.username),
      console.log(this.form.password);
    }
  }
};
</script>

<style scoped>
     
</style>